import Taro, { useDidShow } from "@tarojs/taro";
import { useState } from "react";
import { isEmpty } from "lodash";
import { Tabbar, TabbarItem } from "@antmjs/vantui";
import "@antmjs/vantui/es/tabbar/style";
import "@antmjs/vantui/es/tabbar-item/style";

const Tabbars = () => {
  const [current, setCurrent] = useState<number>(0);
  useDidShow(() => {
    setCurrent(0);
  });
  const handleClick = (value: number) => {
    const userInfo = Taro.getStorageSync("userInfo");
    setCurrent(value);
    // if (value === 1) {
    //   Taro.navigateTo({
    //     url: "/pages/result/result"
    //   });
    // }
    if (value === 1) {
      Taro.navigateTo({
        url: "/pages/popular_science/popular_s"
      });
    }
    if (value === 2 && !isEmpty(userInfo)) {
      Taro.redirectTo({
        url: "/pages/person/person"
      });
    }
    if (value === 2 && isEmpty(userInfo)) {
      Taro.navigateTo({
        url: "/components/login/login"
      });
    }
  };

  return (
    <Tabbar
      activeColor='#666666'
      inactiveColor='#333333'
      active={current}
      border={false}
      onChange={(res: any) => handleClick(res.detail)}
    >
      <TabbarItem icon='wap-home-o'>首页</TabbarItem>
      {/* <TabbarItem icon='search'>成果</TabbarItem> */}
      <TabbarItem icon='newspaper-o'>探索</TabbarItem>
      <TabbarItem icon='user-circle-o'>我的</TabbarItem>
    </Tabbar>
  );
};

export default Tabbars;
